<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="shortcut icon" href="img/logo_mini.png" type="image/x-icon" />
    <link rel="stylesheet" href="css/style.css" />
    <title>Контакты</title>
  </head>

  <body>
    <!-- Меню -->
    <div class="menu" style="background-image: url(img/background.jpg)">
      <div class="container">
        <div class="row">
          <div class="logo">
            <a href="index.html">
              <img src="img/logo.png" alt="логотип" />
            </a>
          </div>
          <ul>
            <li><a href="index.html">Главная</a></li>
            <li><a href="catalog.html">Каталог</a></li>
            <li><a href="man.html">Мужское</a></li>
            <li><a href="woman.html">Женское</a></li>
            <li><a href="contacts.html">Контакты</a></li>
          </ul>
          <div class="phone">
            <a href="tel:+78005353555">&#9742; +7 (800) 535-35-55</a>
          </div>
        </div>
      </div>
    </div>
    <!-- Контакты -->
    <div class="our-contacts">
      <div class="container">
        <div class="row">
          <div class="col-9 col-lg-12">
            <div class="contacts-block">
              <h2>Крымск</h2>
              <div class="contacts-inner">
                <div class="contacts-card">
                  <img src="img/icons/envelope.png" alt="пишите" />
                  <h3>Пишите</h3>
                  <p>Test@mail.ru</p>
                </div>
                <div class="contacts-card">
                  <img src="img/icons/phone-call.png" alt="пишите" />
                  <h3>Звоните</h3>
                  <p>+7 (800) 535-35-55</p>
                </div>
                <div class="contacts-card">
                  <img src="img/icons/distance.png" alt="пишите" />
                  <h3>Приезжайте</h3>
                  <p>ул. М. Горького 160</p>
                </div>
              </div>
              <div style="position: relative; overflow: hidden">
                <script
                  type="text/javascript"
                  charset="utf-8"
                  async
                  src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3A854f07ac92a9f1cb424e0418d2e9217f411677fd7b1e90127a1e9a951e004732&amp;width=500&amp;height=400&amp;lang=en_FR&amp;scroll=true"
                ></script>
              </div>
            </div>
          </div>
          <div class="col-3 col-lg-12" id="cities">
            <h2>Наши магазины</h2>
            <input type="text" class="search" placeholder="Поиск" />
            <ul class="list">
              <li>
                <p class="city">
                  Нижний Новгород, улица Горького 160, магазин "Vibe Style".
                  8(800)535-35-55
                </p>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>

    <!-- Футер -->
    <div class="footer">
      <div class="container">
        <div class="row">
          <div class="col-12 text-center">
            <a href="policy.html">Политика конфиденциальности</a>
            <span class="accent-color">&copy; </span> Vibe Style, 2023
          </div>
        </div>
      </div>
    </div>

    <script src="js/list.min.js"></script>
    <script>
      // Документация
      // https://listjs.com/
      // Инициализация
      let options = {
        valueNames: ["city"],
      };

      let userList = new List("cities", options);
    </script>
  </body>
</html>
